<template>
    <div class="await">
        <Tabs :animated="false" type="card" v-model="tabsName">
            <TabPane label="清分待对账单" name="清分待对账单">
                <AbnormalBill :selectSource="selectSource"></AbnormalBill>
            </TabPane>
            <TabPane label="待对账异常单" name="待对账异常单">
                <ClearingBill v-if="tabsName == '待对账异常单'" :selectSource="selectSource" :isDetailsPageReturn="isDetailsPageReturn"></ClearingBill>
            </TabPane>
        </Tabs>
    </div>
</template>
<script>
import { Tabs, TabPane, Message } from "view-design";
import AbnormalBill from "./AbnormalBill";
import ClearingBill from "./ClearingBill";
import { namespace } from "../Module/awaitaBillAbnormalModule";

export default {
    name: "await_bill",
    components: {
        AbnormalBill,
        ClearingBill,
        Tabs,
        TabPane,
        Message
    },
    data() {
        return {
            tabsName: '清分待对账单',
            isDetailsPageReturn: false,  /** 是否从详情页面返回 **/
            selectSource: [], /** 商品类型select */
        };
    },
    beforeRouteEnter(to, from, next){
        next(vm => {
            if ( from.path.indexOf('awaitBillUnusualDetele') > -1 ) {
                vm.tabsName = '待对账异常单';
                vm.isDetailsPageReturn = true;
            }
        });
    },
    created() {
        this.getKey();
    },
    methods: {
        /** 字典 - 商品类型 */
        async getKey() {
            try {
                let res = await this.$store.dispatch(`${namespace}/getSearchKey`);
                if (res.data.ret === 0) {
                    let data = res.data.data;
                    this.selectSource = data.orderSource; // 商品类型
                }
            } catch (error) {
                this.$Message.error({
                    content: error
                })
            }
        },
    },
    async mounted() {
        setTimeout(() => {
            this.loading = false;
        }, 1000);
    }
};
</script>

<style lang="less" scoped>
.await {
    .timeWidth {
        width: 100%;
    }
    .loadMoreBtn {
        margin-top: 20px;
        text-align: center;
    }
}
</style>
